<template>
	<view>
		<uni-forms ref="form" :modelValue="form" :rules="rules" label-width="180rpx" label-align="right"
			style="margin-top:40rpx;padding: 0 30rpx 0 10rpx;">
			<uni-forms-item label="模板管理员" name="manageIds">
				<custom-tree-select mutiple dataLabel="label" :choseParent="false" :childernDisabled="true" placeholder="请选择模板管理员" :listData="deptOptions" v-model="defaultManage" />
			</uni-forms-item>
			<uni-forms-item label="模板名称" name="name">
				<uni-easyinput v-model="form.name" type="text" placeholder="请输入模板名称" />
			</uni-forms-item>
			<uni-forms-item label="合同类型" name="contractTypeId">
				<uni-data-select v-model="form.contractTypeId" :localdata="contractArr" :clear="false"></uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="签约主体" name="signMax" style="display: flex;align-items: center;margin-bottom: 30rpx;">
				<uni-number-box v-model="form.signMax" />
			</uni-forms-item>
			<uni-forms-item label="企业签署要求" name="signSet" style="margin-bottom: 26rpx;">
				<view class="flex_row">
					<uni-data-checkbox multiple v-model="companyCheck" :localdata="companySet"></uni-data-checkbox>
				</view>
			</uni-forms-item>
			<uni-forms-item label="个人签署要求" name="signSet">
				<view class="flex_row">
					<uni-data-checkbox multiple v-model="personCheck" :localdata="personalSet"></uni-data-checkbox>
				</view>
			</uni-forms-item>
			<uni-forms-item label="模板使用人" name="departmentIds">
				<custom-tree-select mutiple dataLabel="label" placeholder="请选择模板使用人" 
				:listData="deptOptions" v-model="defaultDepart" @selectChange="selectDep"/>
			</uni-forms-item>
			<uni-forms-item label="模板状态" name="status" style="display: flex;align-items: center;">
				<span @click="switchChange(form)">
					<switch color="#00a660" style="transform:scale(0.7)" :checked="form.status == 1?true:false" disabled />
				</span>
			</uni-forms-item>
			<uni-forms-item label="模板备注" name="remark">
				<uni-easyinput v-model="form.remark" type="textarea" placeholder="请输入备注" />
			</uni-forms-item>
		</uni-forms>
		<view class="footer-btn">
			<button @click="cancel" size="mini" class="cancel_btn">取 消</button>
			<button @click="submitForm" size="mini" class="confirm_btn">确 定</button>
		</view>
	</view>
</template>

<script>
	import {uniqueArr} from "@/utils";
	import {treeSelectAndStaff} from "@/api/ec/console/org/dept";
	import {listStaffByDeptId} from "@/api/ec/console/org/staff";
	import {listByCompanyId} from "@/api/ec/console/busiConfig/contractType";
	import {listBycontractTypeId} from "@/api/ec/console/busiConfig/contractBusinessType";
	import {listTemplate, getTemplate, delTemplate, addTemplate, updateTemplate} from "@/api/ec/console/busiConfig/template";
	export default {
		data() {
			return {
				personCheck:[1,0],
				companyCheck:[1,0],
				defaultLine:{},
				selectedIndex: '',
				deptOptions: [], //所在部门 
				// 员工数据
				staffList: null,
				// 企业签署要求  
				companySet: [{
					text: '企业盖章',
					value: 1,
					disable: true,
				}, {
					text: '授权人签字章',
					value: 0
				}],
				// 个人签署要求
				personalSet: [{
					text: '标准签字章',
					value: 1
				}, {
					text: '手写签字章',
					value: 0
				}],
				form: {},
				defaultManage:[], //默认选择的模板管理员
				defaultDepart:[], //默认选择的模板使用人
				contractArr: [], //合同类型
				rules: {
					manageIds:{
						rules:[
							{
							required: true,
							errorMessage: "请选择模板管理员",	
							trigger: "change"
							},
						]
					},
					name: {
						rules: [{
							required: true,
							errorMessage: "请输入模板名称",
						}, ]
					},
				},
			}
		},
		onLoad(option) {
			this.getTreeSelect()  //获取下拉tree数据 
			this.getContractType()  //合同类型 
			if (option.id) {
				// 编辑回显
				this.handleEdit(option.id)
			}else{
				this.handleAdd();
			}
		},
		methods: {
			/** 编辑模板显示 */
			handleEdit(id){
				getTemplate(id).then((response) => {
					this.form = response.data;
					// 赋值管理员
					if(!!this.form.manageIds){
					  this.form.manageIds = this.form.manageIds.split(",").map(d=>{return parseInt(d)});
					} else {
					  this.form.manageIds = [];
					}
					// 添加法人 管理员
					let legalId = this.$store.getters.staffInfo.legalId;
					let adminId = this.$store.getters.staffInfo.adminId;
					if (legalId != 0 && legalId != adminId) {
					  this.form.manageIds.push(this.$store.getters.staffInfo.legalId);
					}
					this.form.manageIds.push(adminId);
					this.form.manageIds = uniqueArr(this.form.manageIds);   
					// 模板管理员 
					this.defaultManage = this.form.manageIds.toString()
					// 模板使用人 
					this.defaultDepart = JSON.parse(this.form.departmentIds).toString()
					// 企业签署要求
					if(this.form.signSet == 1){
						this.companyCheck = [1,0]
					}else if(this.form.signSet == 0){
						this.companyCheck = [1]
					}
					// 个人签署要求 
					if (this.form.signPerson == 1) {
						this.personCheck = [1]
					}else if(this.form.signPerson == 0) {
						this.personCheck = [0]
					}else{
						this.personCheck = [1,0]
					}
				})
			},
			/** 新增模板显示 */
			handleAdd(){
				this.reset()
				this.form.manageIds = [];
				// 获取模板管理员
				let legalId = this.$store.getters.staffInfo.legalId;
				let adminId = this.$store.getters.staffInfo.adminId;
				if (legalId != 0 && legalId != adminId) {
					this.form.manageIds.push(this.$store.getters.staffInfo.legalId);
				}
				this.form.manageIds.push(adminId);
				// 如果是其他普通员工添加的 也设置为管理员 
				this.form.manageIds.push(this.$store.getters.staffInfo.id);
				this.form.manageIds = uniqueArr(this.form.manageIds);
				// 模板管理员
				setTimeout(()=>{
					this.defaultManage = this.form.manageIds.toString()
				},300)
			},
			/** 查询部门下拉树结构 */
			getTreeSelect() {
                this.$modal.loading();
				let data = {
					isCertify: 1,
					status: 1
				}
				treeSelectAndStaff(data).then(response => {
					uni.hideLoading()
					this.deptOptions = response.data
				});
			},
			// 选择模板使用人
			selectDep(e){
				this.form.contractTemplateUseList = e
			},
			submitForm() {
				this.$refs.form.validate().then((res) => {
					// 企业签署要求 
					if(this.companyCheck.length == 2){
						this.form.signSet = 1
					}else if(this.companyCheck.length == 1){
						this.form.signSet = 0
					}
					// 个人签署要求 
					if(this.personCheck == 1){
						this.form.signPerson = 1
					}else if(this.personCheck == 0){
						this.form.signPerson = 0
					}else{
						this.form.signPerson = '1,0'
					}
					this.form.departmentIds = null;
					if(!!this.form.manageIds){
					    this.form.manageIds = this.defaultManage
					}
					if (this.form.id != null) {
						updateTemplate(this.form).then(response => {
				           this.$modal.msgSuccess("修改成功");
							setTimeout(() => {
								this.cancel()
							}, 300)
						});
					} else {
						addTemplate(this.form).then(response => {
							this.$modal.msgSuccess("新增成功");
							setTimeout(() => {
								this.cancel()
							}, 300)
						});
					}
				})
			},
			// 表单重置
			reset() {
			  this.form = {
			    id: null,
			    companyId: null,
			    name: null,
			    wordPath: null,
			    pageCount: null,
			    content: null,
			    ctype: null,
			    paramNum: null,
			    contractTypeId: null,
			    contractBusinessTypeId: null,
			    departmentIds: null,
			    operId: null,
			    updateTime: null,
			    createTime: null,
				status: 1, //模板状态
				signMax: 2, //签约主体
				signPerson: [1, 0], //个人签署要求
				signSet: 1, //企业签署要求
			  };
			},
			iconChange() {
				this.$refs.iconDialog.open('center')
			},
			/** 修改模板使用人 */
			selectStaff(item, value) {
				this.form.staffIdsList = value
			},
			/** 修改模板状态 */
			switchChange(item) {
				this.form.status = item.status == 1 ? 0 : 1;
			},
			/** 合同类型 */
			getContractType() {
				// 根据当前登录公司 查询合同类型 
				listByCompanyId().then((response) => {
					var list = []
					for (var i = 0; i < response.data.length; i++) {
						var object = {};
						object.text = response.data[i].name; // 展示text
						object.value = response.data[i].id; // 用id查询
						list.push(object);
					}
					this.contractArr = list
					this.form.contractTypeId = this.contractArr[0].value;
				})
			},
			/** 取消 */
			cancel() {
				// 返回时刷新列表数据
				uni.$emit('refreshData');
				uni.navigateBack(1)
			},
		}
	}
</script>

<style scoped lang="scss">
	::v-deep .uni-data-checklist .checklist-group .checklist-box{
		margin-right: 0;
		width: 200rpx;
	}
	// 问号图标
	.wenhaoIcon {
		font-size: 24rpx;
		margin-left: 10rpx;
		padding-top: 5rpx;
		color: #999999;
	}

	.selected-item-text-overflow {
		width: 182px;
		/* fix nvue */
		overflow: hidden;
		/* #ifndef APP-NVUE */
		white-space: nowrap;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		/* #endif */
	}

	.selected-item-active {
		border-bottom: 2px solid $uni-color-primary;
	}

	.selected-item-text {
		color: $uni-color-primary;
	}

	.selected-list {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		flex-wrap: nowrap;
		padding: 0 5px;
		border-bottom: 1px solid #f8f8f8;
	}

	.selected-item {
		margin-left: 10px;
		margin-right: 10px;
		padding: 12px 0;
		text-align: center;
		/* #ifndef APP-NVUE */
		white-space: nowrap;
		/* #endif */
	}

	.carefule {
		display: block;

		p {
			text-indent: 2em;
			color: #666666;
		}
	}

	.flex_row {
		display: flex;
		align-items: center;
		margin-top: 15rpx;
	}

	.footer-btn {
		margin-top: 180rpx;
		width: 100%;
		text-align: center;

		.confirm_btn {
			margin-left: 50rpx;
			width: 40%;
			background-color: $uni-color-primary;
			color: #fff;
			display: inline-block;
			height: 70rpx;
			line-height: 70rpx;
		}
	}

	.cancel_btn {
		background-color: #fff;
		color: $uni-color-primary;
		width: 40%;
		display: inline-block;
		height: 70rpx;
		line-height: 70rpx;
		border: 1rpx solid $uni-color-primary;
	}

	page {
		background: $uni-bg-color;
	}

	// 修改字体大小
	::v-deep .uni-data-checklist .checklist-group .checklist-box .checklist-content .checklist-text {
		font-size: 26rpx;
	}

	::v-deep .uni-dialog-content {
		display: block;
	}

	::v-deep .uni-noticebar__content-text {
		font-size: 22rpx;
	}

	::v-deep .uni-easyinput__content-input {
		font-size: 26rpx
	}

	::v-deep .uni-easyinput {
		font-size: 26rpx
	}

	::v-deep .uni-easyinput__content-textarea {
		font-size: 26rpx
	}

	::v-deep .uni-input-input {
		font-size: 26rpx
	}

	// 多选框边距
	::v-deep .uni-data-checklist .checklist-group .checklist-box:last-child {
		margin-left: 36rpx;
	}

	::v-deep .uni-data-checklist {
		flex: none;
	}

	::v-deep .uni-easyinput__content-textarea {
		height: 100rpx;
		min-height: 100rpx;
	}

	::v-deep .uni-select__selector-item {
		font-size: 26rpx !important;
	}

	::v-deep .uni-select__input-text {
		font-size: 26rpx !important;
	}

	::v-deep .uni-forms-item__label {
		font-size: 26rpx;
		padding: 0 12rpx 0 0;
	}

	::v-deep .uni-date__x-input {
		font-size: 24rpx;
	}
</style>
